import { useEffect, useState } from 'react';
import _ from '@/utils/commonFn';

const useScrollbottom = () => {
  const [isBottom, setIsBottom] = useState(false);

  const scrollBottom = _.throttle(() => {
    const scrollHeight = document.documentElement.scrollHeight,
      scrollTop = document.documentElement.scrollTop,
      clientHeight = document.documentElement.clientHeight;

    //   滚动的距离 + 可视的距离 >= 总高度 - 50 时，滚动到底部
    if (scrollTop + clientHeight >= scrollHeight - 10) {
      setIsBottom(true);
    } else {
      setIsBottom(false);
    }
  }, 500);

  useEffect(() => {
    window.addEventListener('scroll', scrollBottom);
    return () => {
      window.removeEventListener('scroll', scrollBottom);
    };
  }, []);

  return isBottom;
};

export default useScrollbottom;
